[iOS 7] iOSアイコンファイル早見表(2013/9)
iOS7でのデザインリニューアルに伴ってアイコンサイズも変更になりました。
これが意外とややこしいので、デバイスとOSバージョンによって必要になるアイコンファイルを一覧にまとめてみました。
iOSアイコンファイル早見表(2013/9)
アイコン種別 | ファイル名 | iPhone | iPad | サイズ | 角丸半径 *1 | ||
---|---|---|---|---|---|---|---|
iOS5,6 | iOS7 | iOS5,6 | iOS7 | ||||
アプリアイコン | Icon.png | ○ | 57 x 57 | 10 | |||
[email protected] | ○ | 114 x 114 | 20 | ||||
Icon-72.png | ○ | 72 x 72 | 12 | ||||
[email protected] | ○ | 144 x 144 | 24 | ||||
Icon-60.png | *2 | 60 x 60 | 13 | ||||
[email protected] | ○ | 120 x 120 | 26 | ||||
Icon-76.png | ○ | 76 x 76 | 17 | ||||
[email protected] | ○ | 152 x 152 | 34 | ||||
設定・Spotlightアイコン | Icon-Small.png | ○ | ○ | ○ | 29 x 29 | 5 | |
[email protected] | ○ | ○ | ○ | ○ | 58 x 58 | 10 | |
Icon-Small-40.png | ○ | 40 x 40 | 9 | ||||
[email protected] | ○ | ○ | 80 x 80 | 18 | |||
Icon-Small-50.png | ○ | 50 x 50 | 9 | ||||
[email protected] | ○ | 100 x 100 | 20 | ||||
AppStoreアイコン | iTunesArtwork | ○ | ○ | ○ | ○ | 512 x 512 | 90 |
iTunesArtwork@2x | ○ | ○ | ○ | ○ | 1024 x 1024 | 180 |
*1 角丸半径は大まかな値ですので、あくまでアイコンをデザインする際の目安として捉えてください。
*2 iOS7をインストールできる非Retinaのデバイスは現時点で存在しないため今のところ必要ありません。
ケース1:iPhone x iOS7をターゲットにしたアプリ開発
プロトタイピングでしかお目にかかれなそうな・・最もシンプルなケースです。
上記のアイコンファイル早見表で、iPhoneのiOS7に○が付いてるアイコンファイルだけ用意すればOKです。
アイコン種別 | ファイル名 | iPhone | iPad | サイズ | 角丸半径 *1 | ||
---|---|---|---|---|---|---|---|
iOS5,6 | iOS7 | iOS5,6 | iOS7 | ||||
アプリアイコン | [email protected] | ○ | 120 x 120 | 26 | |||
設定・Spotlightアイコン | [email protected] | ○ | ○ | ○ | ○ | 58 x 58 | 10 |
[email protected] | ○ | ○ | 80 x 80 | 18 | |||
AppStoreアイコン | iTunesArtwork | ○ | ○ | ○ | ○ | 512 x 512 | 90 |
iTunesArtwork@2x | ○ | ○ | ○ | ○ | 1024 x 1024 | 180 |
ケース2:iPhone & iPad x iOS7をターゲットにしたアプリ開発
ケース1にiPad対応を含めてみました。今後の開発案件で増えて行くと思われるケースです。
このケースの場合はiPhoneのiOS7、iPadのiOS7に○が付いているアイコンを合わせて用意すればOKです。
アイコン種別 | ファイル名 | iPhone | iPad | サイズ | 角丸半径 *1 | ||
---|---|---|---|---|---|---|---|
iOS5,6 | iOS7 | iOS5,6 | iOS7 | ||||
アプリアイコン | [email protected] | ○ | 120 x 120 | 26 | |||
Icon-76.png | ○ | 76 x 76 | 17 | ||||
[email protected] | ○ | 152 x 152 | 34 | ||||
設定・Spotlightアイコン | Icon-Small.png | ○ | ○ | ○ | 29 x 29 | 5 | |
[email protected] | ○ | ○ | ○ | ○ | 58 x 58 | 10 | |
Icon-Small-40.png | ○ | 40 x 40 | 9 | ||||
[email protected] | ○ | ○ | 80 x 80 | 18 | |||
AppStoreアイコン | iTunesArtwork | ○ | ○ | ○ | ○ | 512 x 512 | 90 |
iTunesArtwork@2x | ○ | ○ | ○ | ○ | 1024 x 1024 | 180 |
ケース3:iPhone & iPad x iOS5〜7をターゲットにしたアプリ開発
現時点はこれが最も多いケースかもしれませんね。はい、今iOS5切りたいと思った方。貴方とはいいお酒が飲めそうです。
このケースはiPhoneのiOS5,6とiOS7、iPadのiOS5,6とiOS7に○が付いているアイコン(ほぼ全て)を用意すればOKです。
アイコン種別 | ファイル名 | iPhone | iPad | サイズ | 角丸半径 *1 | ||
---|---|---|---|---|---|---|---|
iOS5,6 | iOS7 | iOS5,6 | iOS7 | ||||
アプリアイコン | Icon.png | ○ | 57 x 57 | 10 | |||
[email protected] | ○ | 114 x 114 | 20 | ||||
Icon-72.png | ○ | 72 x 72 | 12 | ||||
[email protected] | ○ | 144 x 144 | 24 | ||||
[email protected] | ○ | 120 x 120 | 26 | ||||
Icon-76.png | ○ | 76 x 76 | 17 | ||||
[email protected] | ○ | 152 x 152 | 34 | ||||
設定・Spotlightアイコン | Icon-Small.png | ○ | ○ | ○ | 29 x 29 | 5 | |
[email protected] | ○ | ○ | ○ | ○ | 58 x 58 | 10 | |
Icon-Small-40.png | ○ | 40 x 40 | 9 | ||||
[email protected] | ○ | ○ | 80 x 80 | 18 | |||
Icon-Small-50.png | ○ | 50 x 50 | 9 | ||||
[email protected] | ○ | 100 x 100 | 20 | ||||
AppStoreアイコン | iTunesArtwork | ○ | ○ | ○ | ○ | 512 x 512 | 90 |
iTunesArtwork@2x | ○ | ○ | ○ | ○ | 1024 x 1024 | 180 |
編集後記
対応するデバイス、OSバージョンが増えていくと必要になるアイコンも総じて増えていきますね。
ただまだまだiOS6対応は外せないと思いますので、そんな時はこの早見表を活用してもらえれば嬉しいです。
またXcode5ではイメージリソースの管理方法が進化して、アイコンファイルも管理しやすくなりました。
こちらはまた別の機会にご紹介できればと思います。
山本